/* 鍒濆鍖� */
   fieldset {
     margin: 0;
     padding: 0;
     border: 0;
   }

   body,
   div,
   img,
   td,
   table,
   form {
     margin: 0;
     padding: 0;
     border: 0;
     font-size: 16px;
   }

   /* a杩炴帴瀹氫箟棰滆壊 */
   a {
     color: #000;
   }

   /* 鏂囧瓧宸﹀彸瀵归綈 */
   .p {
     text-align: justify;
     text-indent: 2em;
     line-height: 31px;
     margin-top: 20px;
     font-size: 1rem;
   }

   /* 鏂囧瓧宸﹀彸瀵归綈 */
   .p2 {
     text-align: justify;
     line-height: 31px;
     margin-top: 20px;
     font-size: 1rem;
   }

   /* 鍘婚櫎鐐� */
   ul,
   ol,
   li {
     list-style: none;
   }

   /* 鍘婚櫎a閾炬帴涓嬪垝绾� */
   a {
     text-decoration: none;
   }

   /* 娓呴櫎 */
   .clear {
     clear: both;
   }

   .width_all {
     width: 100%;
   }

   .width1200 {
     width: 90vw;
     margin: 0 auto;

   }

   @media screen and (max-width: 899px) {
     .width1200 {
       width: 100%;
       margin: 0 auto;

     }
   }

   .biaoti {
     margin: 0 0 0 20px;
     color: #fff;
   }


   /*棣栭〉鍏徃绠€浠�*/
   .about_left {
     float: left;
     width: 80%;

   }

   .about_right {
     float: right;
     width: 18%;

   }

   .column {
     margin-top: 10px;
     height: 48px;
     line-height: 48px;
     padding: 0 0 0 0;
     background: #01459a;
   }

   @media screen and (max-width: 899px) {
     .about_left {

       width: 100%;

     }

     .about_right {

       width: 100%;

     }
   }

   /*鏈嶅姟椤圭洰*/
   .fuwu {
     text-align: center;
     font-size: 31px;
     color: red;
     width: 100%;
     height: 48px;
     line-height: 48px;
     color: #FF6600;
     margin-bottom: 20px;
   }

   .fuwubiaoti {
     font-size: 20px;
   }

   .fuwujiage {
     font-size: 31px;
     color: #FF6600;
   }

   .wangzhankaifa {
     text-align: center;
     float: left;
     width: 20vw;
     margin: 10px;
     padding: 5px;
     border: 1px solid #eee;
     transition: transform 0.3s ease;
     /* 骞虫粦鐨勮繃娓℃晥鏋� */
     transform: translateY(0);
     /* 鍒濆鐘舵€侊紝涓嶄綅绉� */
   }

   .wangzhankaifa:hover {
     transform: translateY(-18px);
     background-color: #F6F6F6;
   }

   @media (max-width: 600px) {
     .wangzhankaifa {
       text-align: center;
       float: left;
       width: 95%;
       margin: 10px;
       padding: 5px;
       border: 1px solid #eee;
       transition: transform 0.3s ease;
       /* 骞虫粦鐨勮繃娓℃晥鏋� */
       transform: translateY(0);
       /* 鍒濆鐘舵€侊紝涓嶄綅绉� */
     }

     .wangzhankaifa:hover {
       transform: translateY(-6px);
       background-color: #F6F6F6;
     }
   }

   /*600-900灞忓箷*/
   @media screen and (min-width: 600px) and (max-width: 900px) {
     .wangzhankaifa {
       text-align: center;
       float: left;
       width: 47%;
       margin: 10px;
       padding: 5px;
       border: 1px solid #eee;
       transition: transform 0.3s ease;
       /* 骞虫粦鐨勮繃娓℃晥鏋� */
       transform: translateY(0);
       /* 鍒濆鐘舵€侊紝涓嶄綅绉� */
     }

     .wangzhankaifa:hover {
       transform: translateY(-18px);
       background-color: #F6F6F6;
     }
   }

   .fubiaoti {
     height: 20px;
     line-height: 20px;
     color: #262626;
     margin-top: 10px;
     margin-bottom: 36px;
   }

   .text {
     line-height: 23px;
     margin-bottom: 15px;
   }

   /* 棣栭〉浜у搧鎺ㄨ崘 */
   .container {
     max-width: 90vw;
     margin: 0 auto;
     padding: 20px;
     display: flex;
     flex-wrap: wrap;
     justify-content: flex-start;
     /* 淇敼涓洪潬宸︽帓鍒� */
     /*border: 1px solid black;*/
   }

   .image-container {
     flex: 0 0 calc(25% - 20px);
     /* 淇敼涓哄噺鍘讳袱涓杈硅窛鐨勫搴� */
     margin-bottom: 20px;
     margin-right: 10px;
     /* 娣诲姞鍙充晶澶栬竟璺� */
     position: relative;
     overflow: hidden;
     height: 25vh;
     /* 鍋囪浣犳兂瑕佺殑楂樺害 */
   }

   .image-container:nth-child(4n) {
     /* 閫夋嫨姣忓洓涓」鐩殑鏈€鍚庝竴涓紝绉婚櫎鍏跺彸渚у杈硅窛 */
     margin-right: 0;
   }

   .image-container img {
     width: 100%;
     height: auto;
     /* 淇敼涓篴uto浠ヤ繚鎸佸浘鐗囨瘮渚� */
     object-fit: cover;
     display: block;
     vertical-align: middle;
     transition: transform 0.3s ease;
   }

   .image-container:hover img {
     transform: scale(1.3);
   }

   .caption {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     padding: 10px;
     background-color: rgba(0, 0, 0, 0.5);
     color: #fff;
     text-align: center;
     font-size: 1rem;
   }

   .caption:hover {
     background-color: rgba(1, 2, 3, 0.8);
   }

   @media (max-width: 600px) {
     .image-container {
       flex: 0 0 100%;
       margin-right: 0;
       /* 鍦ㄥ皬灞忓箷涓婄Щ闄ゅ彸渚у杈硅窛 */
     }
   }

   /* 搴曢儴鐗堟潈 */
   .footer {
     width: 100%;
     background: #27303f;
   }

   .footer_txt {
     color: #6a6a6a;
   }

   /* 鍐呴〉閫氱敤锛氬叕鍙哥畝浠�/浜у搧灞曠ず/鏂伴椈椤甸潰/鑱旂郴鏂瑰紡/鐣欒█ */
   .class_left {
     float: left;
     width: 18%;
   }

   .content_right {
     float: right;
     width: 80%;
   }

   @media screen and (max-width: 899px) {
     .class_left {
       width: 100%;
     }

     .content_right {
       width: 100%;
     }
   }

   /* 宸︿晶鍏敤鏍忕洰 */
   .public_left_menu {
     float: left;
     padding: 0px;
     line-height: 24px;
     width: 100%;
   }

   .public_left_menu_list {
     background: #000;
   }

   .public_left_menu_list_li {
     float: left;
     margin: 0px;
     padding: 0px;
     width: 100%;
     height: 45px;
     line-height: 45px;
     margin-top: 2px;
     display: block;
     color: #000;
     background: #F2F2F2;
   }

   @media screen and (max-width: 899px) {
     .public_left_menu_list_li {
       float: left;
       margin: 0px;
       padding: 0px;
       width: 100%;
       height: 45px;
       line-height: 45px;
       margin-top: 2px;
       display: block;
       color: #000;
       background: #F2F2F2;
     }
   }

   .public_left_menu_list_li_a {
     color: #333;
     padding-left: 20px;
     background: #F2F2F2 url(../images/list_icon.png) no-repeat 200px center;
     font-size: 16px;
     color: #000;
     display: block;
     transition: all .3s ease;
   }

   .public_left_menu_list_li_a:hover {
     color: #fff;
     background: #e91e63 url(../images/list_icon.png) no-repeat 200px center;
   }




   /* 浜у搧灞曠ず */

   .product {
     float: left;
     width: 1200px;
     background: #f8f8f8;
     /* border: 1px solid #01459A; */
   }

   .product_list {
     float: left;
     margin-right: 15px;
     margin-bottom: 20px;
     width: 208px;
     height: 270px;
     background-color: #fff;
     box-shadow: 1px 2px 3px 0px rgba(118, 118, 118, 0.5);
     display: inline-block;
     /* border: #000 solid 1px; */
     display: inline-block锛�
   }

   /* 鍒犻櫎鍙宠竟绗洓涓浘鐗囩殑杈硅窛 澶囩敤鏆傛椂娌℃湁鐢ㄥ埌*/
   product_list li:nth-child (n) {
     margin: 0;
   }

   .product_list img {
     width: 100%;
   }

   .news_left {
     float: left;
     width: 600px;
     height: 300px;
   }

   .news_right {
     float: right;
     width: 600px;
     height: 300px;
   }


   /*Product*/
   .productList {
     width: 100%;
     float: left;
   }

   .productList_row {
     margin-left: -15px;
     margin-right: -15px;
   }

   .pro_list {
     float: left;
     width: 20%;
     text-align: center;
     margin-bottom: 40px;
     padding: 0 15px;
   }

   .pro_list_box {
     float: left;
     width: 100%;
     box-shadow: 0 0 1px #ccc;
     padding: 10px;
     transition: all .3s ease;
   }

   .pro_list_box:hover {
     box-shadow: 0 0 7px #ccc;
   }

   .pro_list_img {
     float: left;
     width: 100%;
   }

   .pro_list_img a {
     display: block;
     width: 100%;
     padding-bottom: 100%;
     background-size: contain !important;
   }

   .pro_list_title {
     float: left;
     width: 100%;
     height: 30px;
     line-height: 30px;
     overflow: hidden;
   }

   .pro_list_title a {
     transition: all .3s ease;
   }

   .pro_list_box:hover .pro_list_title a {
     color: #01459A;
   }

   .productTitle {
     line-height: 35px;
     font-weight: bold;
     text-align: center;
     font-size: 18px;
   }

   .productImg {
     width: 100%;
     text-align: center;
     float: left;
     margin: 10px auto;
   }

   .productImg img {
     max-width: 100%;
   }

   .productBuy {
     width: 100%;
     text-align: center;
     float: left;
     margin: 10px auto;
   }

   .productBuy a {
     margin: 0 10px;
   }


   /* 杞挱鍥惧够鐏墖 */
   .fader {
     position: relative;
     padding-top: 20%;
     font-family: futura, arial;
     overflow: hidden
   }

   .fader .slide {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 0;
     z-index: 1;
     opacity: 0
   }

   .fader .slide_no {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 0;
     z-index: 1;
     opacity: 1
   }

   .fader img.slide {
     height: auto
   }

   .fader .next,
   .fader .prev {
     position: absolute;
     height: 80px;
     line-height: 55px;
     width: 50px;
     font-size: 100px;
     text-align: center;
     color: #fff;
     top: 45%;
     left: 0;
     /*z-index: 4;*/
     margin-top: -25px;
     cursor: pointer;
     opacity: .7;
     transition: all 150ms
   }

   .fader .next:hover,
   .fader .prev:hover {
     opacity: 1
   }

   .fader .next {
     left: auto;
     right: 0
   }

   .fader .pager_list {
     position: absolute;
     width: 100%;
     height: 40px;
     padding: 0;
     line-height: 40px;
     bottom: 0;
     text-align: center;
     z-index: 4
   }

   .fader .pager_list li {
     display: inline-block;
     width: 15px;
     height: 15px;
     margin: 0 7px;
     /*background: #fff;*/
     opacity: .7;
     text-indent: -9999px;
     border-radius: 999px;
     cursor: pointer;
     transition: all 150ms
   }

   .fader .pager_list li.active,
   .fader .pager_list li:hover {
     opacity: 1
   }

   /*椤电爜*/
   .pages {
     font-size: 12px;
     text-align: center;
     padding: 10px 0px 10px 0px;
   }

   .pages li {
     display: inline-block;
     margin: 3px;
   }

   .pages a {
     font-size: 14px;
     padding: 6px 12px;
     background: #f5f5f5;
     display: block;
   }

   .pages a:hover {
     background: #01459A;
     color: #fff;
   }

   .pages li.active a {
     background: #01459A;
     color: #fff;
   }

   .pages select {
     vertical-align: middle;
     font-size: 8pt;
     padding: 0px;
   }

   .pages b {
     font-weight: normal;
   }

   .pagination {
     display: inline-block;
     padding-left: 0;
     margin: 20px 0;
     border-radius: 4px
   }

   .pagination>li {
     display: inline
   }

   .pagination>li>a,
   .pagination>li>span {
     position: relative;
     float: left;
     padding: 6px 12px;
     margin-left: -1px;
     line-height: 1.42857143;
     color: #337ab7;
     text-decoration: none;
     background-color: #fff;
     border: 1px solid #ddd
   }

   .pagination>li:first-child>a,
   .pagination>li:first-child>span {
     margin-left: 0;
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px
   }

   .pagination>li:last-child>a,
   .pagination>li:last-child>span {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px
   }

   .pagination>li>a:focus,
   .pagination>li>a:hover,
   .pagination>li>span:focus,
   .pagination>li>span:hover {
     z-index: 3;
     color: #23527c;
     background-color: #eee;
     border-color: #ddd
   }

   .pagination>.active>a,
   .pagination>.active>a:focus,
   .pagination>.active>a:hover,
   .pagination>.active>span,
   .pagination>.active>span:focus,
   .pagination>.active>span:hover {
     z-index: 2;
     color: #fff;
     cursor: default;
     background-color: #337ab7;
     border-color: #337ab7
   }

   .pagination>.disabled>a,
   .pagination>.disabled>a:focus,
   .pagination>.disabled>a:hover,
   .pagination>.disabled>span,
   .pagination>.disabled>span:focus,
   .pagination>.disabled>span:hover {
     color: #777;
     cursor: not-allowed;
     background-color: #fff;
     border-color: #ddd
   }

   .pagination-lg>li>a,
   .pagination-lg>li>span {
     padding: 10px 16px;
     font-size: 18px;
     line-height: 1.3333333
   }

   .pagination-lg>li:first-child>a,
   .pagination-lg>li:first-child>span {
     border-top-left-radius: 6px;
     border-bottom-left-radius: 6px
   }

   .pagination-lg>li:last-child>a,
   .pagination-lg>li:last-child>span {
     border-top-right-radius: 6px;
     border-bottom-right-radius: 6px
   }

   .pagination-sm>li>a,
   .pagination-sm>li>span {
     padding: 5px 10px;
     font-size: 12px;
     line-height: 1.5
   }

   .pagination-sm>li:first-child>a,
   .pagination-sm>li:first-child>span {
     border-top-left-radius: 3px;
     border-bottom-left-radius: 3px
   }

   .pagination-sm>li:last-child>a,
   .pagination-sm>li:last-child>span {
     border-top-right-radius: 3px;
     border-bottom-right-radius: 3px
   }

   /*end*/



   /* 閲嶇疆榛樿鏍峰紡 */
   * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
   }

   /* 閫氱敤鏍峰紡 */
   body {
     font-family: Arial, sans-serif;
   }


   /*鐢佃剳-鐗堝鑸爮鏍峰紡*/
   /*澶撮儴鏍峰紡*/
   header {
     width: 100vw;
     background-color: #b00343
   }

   /* Logo鏍峰紡 */
   .logo {
     height: 70px;
     background-image: url('/app/index/view/images/logo.png');
     background-repeat: no-repeat;
     background-color: #fff;
     margin: 0 6.5vw;
     margin-top: 6px;
     : ;
   }

   nav {
     width: 100%;
     height: 48px;
     background-color: #01459a;
   }

   .nav-menu {
     width: 90vw;
     height: 48px;
     line-height: 48px;
     text-align: center;
     background-color: #01459a;
     margin: 0 auto;
   }

   .nav-menu li a {
     float: left;
     width: 14%;
     height: 48px;
     background: #01459a;
     display: block;
     color: #fff;
   }

   .nav-menu a:hover {
     width: 14%;
     height: 48px;
     background: #9a2421;
     display: block;
     color: #dedcdb;
   }

   .anniu {
     float: left;
     width: 14%;
     line-height: 48px;
     text-align: center;
   }

   @media screen and (max-width:500px) {

     /* Logo鏍峰紡 */
     .logo {
       height: 70px;
       line-height: 70px;
       background-image: url('/app/index/view/images/logo.png');
       background-size: 80%;
       background-position: center;
       background-repeat: no-repeat;
     }
   }

   @media screen and (max-width: 900px) {

     /*澶撮儴鏍峰紡*/
     header {
       width: 100vw;
       /*height: 50px;*/
       background-color: #b00343
     }

     /* 瀵艰埅鏍忔牱寮� */
     nav {
       position: absolute;
       top: 0;
       left: 0;
       right: 0;
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 0 5vw;
       height: 80px;
       background-color: rgba(11, 71, 183, 0.0);
     }

     /* Logo鏍峰紡 */
     .logo {
       height: 70px;
       line-height: 70px;
       background-image: url('/app/index/view/images/logo.png');
       /*background-size: cover;*/
       background-position: center;
       background-repeat: no-repeat;
     }

     /* 瀵艰埅鑿滃崟鏍峰紡 */
     .nav-menu {
       flex: 1;
       display: flex;
       justify-content: space-between;
       max-width: 550px;
     }

     /* 瀵艰埅鑿滃崟椤规牱寮� */
     .nav-menu li {
       list-style: none;
       color: #046161;
       font-weight: 600;
     }

     .nav-menu li a {
       float: left;
       width: 190px;
       height: 48px;
       color: #fff;
       background-color: rgba(11, 71, 183, 0.0);
       display: block;
     }

     .nav-menu a:hover {
       width: 190px;
       height: 48px;
       background-color: rgba(0, 0, 0, 0.0);
       display: block;
       color: #dedcdb;
     }

     /* 姹夊牎鍥炬爣鏍峰紡 */
     .burger {
       display: none;
       position: absolute;
       top: 50%;
       transform: translateY(-50%);
       right: 20px;
       cursor: pointer;
     }

     /* 姹夊牎鍥炬爣绾挎潯鏍峰紡 */
     .burger div {
       width: 25px;
       height: 3px;
       background-color: #333;
       margin: 4px 0;
     }

     .nav-menu {
       position: fixed;
       top: 80px;
       right: -100%;
       /* 鍒濆鏃跺鑸彍鍗曞湪灞忓箷鍙充晶涔嬪 */
       width: 30%;
       height: calc(100vh - 80px);
       background-color: rgba(65, 81, 101, 0.4);
       flex-direction: column;
       align-items: center;
       justify-content: flex-start;
       transition: right 0.3s ease-in-out;
     }

     /* 瀵艰埅鑿滃崟鎵撳紑鐘舵€� */
     .nav-menu.open {
       right: 0;
       /* 瀵艰埅鑿滃崟婊戝嚭鏃舵樉绀哄湪灞忓箷鍙充晶 */
       z-index: 9999;
     }

     /* 瀵艰埅鑿滃崟椤瑰姩鐢� */
     .nav-menu li {
       margin: 3vh;
       opacity: 0;
       transform: translateX(20px);
       transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
     }

     /* 姹夊牎鍥炬爣鍦ㄥ皬灞忓箷涓婄殑鏄剧ず */
     .burger {
       display: block;
     }

     /* 姹夊牎鍥炬爣婵€娲荤姸鎬� */
     .burger.active .top-line {
       transform: rotate(45deg) translate(4px, 6px);
     }

     .burger.active .middle-line {
       opacity: 0;
       transform: translate(10px);
     }

     .burger.active .bottom-line {
       transform: rotate(-45deg) translate(4px, -6px);
     }
   }

   /* 鍔ㄧ敾瀹氫箟 */
   @keyframes slidein {
     from {
       transform: translateX(20px);
       opacity: 0;
     }

     to {
       transform: translateX(0);
       opacity: 1;
     }
   }